<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
	String path = request.getContextPath();
	String basePath = request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort()
			+ path + "/";
%>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,user-scalable=no">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>大转盘</title>
    <link rel="stylesheet" href="<%=basePath%>zhuanpan/css/common_mobile.css?version=1.0.0">
    <link rel="stylesheet" href="<%=basePath%>zhuanpan/css/index.css?version=1.0.0">
    <!-- 移动端适配 -->
    <script>
        var html = document.querySelector('html');
        changeRem();
        window.addEventListener('resize', changeRem);

        function changeRem() {
            var width = html.getBoundingClientRect().width;
            html.style.fontSize = width / 10 + 'px';
        }
    </script>
    <style>
        .prize li:nth-child(1){background-image: url("<%=basePath%>zhuanpan/image/guoshou_redpakege.png");}
        .prize li:nth-child(2){background-image: url("<%=basePath%>zhuanpan/image/18yuan_redpakege.png");}
        .prize li:nth-child(4){background-image: url("<%=basePath%>zhuanpan/image/6yuan_redpakege.png");}
        .prize li:nth-child(5){background-image: url("<%=basePath%>zhuanpan/image/guoshou_redpakege.png");}
        .prize li:nth-child(6){background-image: url("<%=basePath%>zhuanpan/image/face.png");background-size: 1.02666667rem 1.02666667rem;}
    </style>
</head>

<body>
<div id="wrap">
    <div class="caidai"></div>
    <div class="header clearfix">
        <p class="rule fl">规则</p>
        <a href="../my.html" id="myWin">
          <!--   <p class="my fr">我的奖品</p> -->
        </a>
        <div class="title"></div>
    </div>     
    <!--轮盘-->
    <div class="rotate">
        <div class="lunpai">
            <ul class="prize running">
                <li>
                    <span></span>
                    <p>15万保额<br>与3元购物金</p>
                </li>
                <li>
                    <span></span>
                    <p>18元购物金</p>
                </li>
                <li>
                    <span></span>
                    <p>谢谢参与</p>
                </li>
                <li>
                    <span></span>
                    <p>6元购物金</p>
                </li>
                <li>
                    <span></span>
                    <p>15万保额<br>与3元购物金</p>
                </li>
                <li>
                    <span></span>
                    <p> 谢谢参与</p>
                </li>
            </ul>
        </div>
        <div class="ring"></div>
        <div id="btn"></div>
    </div>
    <div class="border">
        您今日还有 <span id="change"> ${flag} </span> 次抽奖机会
    </div>
    <!--游戏规则弹窗-->
    <div id="mask-rule">
        <div class="box-rule">
            <span class="star"></span>
            <h2>活动规则说明</h2>
            <span id="close-rule"></span>
            <div class="con">
                <div class="text">
                    <p>1.点击转盘可随机获得话费红包</p>
                </div>
            </div>
        </div>
    </div>
    <!--中奖提示-->
    <div id="mask">
        <div class="blin"></div>
        <div class="caidai"></div>
        <div class="winning">
            <div class="red-head"></div>
            <div class="red-body">
                <!-- 中奖奖品 -->
                <p class="gift_key"></p>

            </div>
            <div id="card">
                <a href="" target="_self" class="win"></a>
            </div>
            
            <a href="" target="_self" class="btn"></a>
            <span id="close"></span>
        </div>
    </div>
</div>

<script src="<%=basePath%>zhuanpan/js/jquery.min.js"></script>
<script src="<%=basePath%>zhuanpan/js/jquery.rotate.js"></script>
<script src="<%=basePath%>zhuanpan/js/h5_game_common.js?version=1.0.0"></script>
<script>
    price_safe=false;
    var Count = ${flag}; //後台剩餘次數更新
        data = {
            count: Count
        }; //次数
$(function () {
          /*   ["8元购物金", "26元购物金", "谢谢参与", "66元购物金", "6元购物金","16元购物金"] */
        var tips = ["15万保额", "18元购物金", "谢谢参与", "15万保额", "谢谢参与","6元购物金"], //中奖提示
        $ring = $(".ring"),
        $prize = $(".prize"), //转盘
        $btn = $("#btn"), //按钮
        $change = $("#change"), //显示剩余抽奖机会
        $li = $(".scroll li"), //中奖信息滚动的盒子
        $sNum = $(".start-num"), //手机头号，三位数
        $eNum = $(".end-num"), //手机尾号，四位数
        $info = $(".info"), //中奖提示信息

        bool = false, //判断是否在旋转，true表示是，false表示否
        timer; //定时器
        phone_num = '${mobile}';//手機號
        ParentId = '${parentid}'; //代理商ID
        call = 0;//抽中話費
        shop = 0;//抽中購物金
        userid = '${userid}';


    init();

    function init() {
        timer = setInterval(function () {
            $ring.toggleClass("light");
        }, 1000);
    }

    //点击抽奖
    $btn.click(function () {
        if (bool) return; // 如果在执行就退出
        bool = true; // 标志为 在执行
        Count--;
        if (Count <= -1) {
            Count = 0;
        }
        $change.html(Count); //显示剩余次数
        $prize.removeClass("running");
        clickFn();
    });

    //随机概率
    function clickFn() {
        //data为随机出来的结果，根据概率后的结果
        //概率控制
        var Prob = Math.round(Math.random() * 100); //随机获取100之内的任意一个整数；
        var data = Prob;
        var pro_arr=[${dialfirst}, ${dialsecond}, ${dialthird}, ${dialfourth}, ${dialfifth}, ${dialsixth}];
        var newpro_arr=[];
        var prosum = 0;
        for(var i=0;i<pro_arr.length-1;i++){
            prosum +=pro_arr[i];
            newpro_arr.push(prosum);
        }
        console.log(newpro_arr);
        if(Count==1){
            data = 3; //15W 10%√
        }else if (Prob <= newpro_arr[0]) {
            data = 2; //谢谢15% √
        } else if (Prob > newpro_arr[0] && Prob <= newpro_arr[1]) {
            data = 5; //谢谢参与20%√
        } else if (Prob > newpro_arr[1] && Prob <= newpro_arr[2]) {
            data = 1; //15W 20%√
        } else if (Prob > newpro_arr[2] && Prob <= newpro_arr[3]) {
            data = 4; // 6元 30%
        } else if (Prob > newpro_arr[3] && Prob <= newpro_arr[4]) {
            data = 6; //18元 5%√
        } else data = 3; //15W 10%√
        console.log(data);
        switch (data) { //中奖概率，可控。根据得到的随机数控制奖品
            case 1:
                rotateFn(1, 0, tips[0]); //15W 
                call = 3;
                price_safe=true;
                break;
            case 2:
                rotateFn(2, 60, tips[4]); //谢谢 
                call = 0;
                break;
            case 3:
                rotateFn(3, 120, tips[3]); //15W  
                call = 3;
                price_safe=true;
                break;
            case 4:
                rotateFn(4, 180, tips[5]); //6元
                call = 6;
                break;
            case 5:
                rotateFn(5, 240, tips[2]); //谢谢参与 
                call = 0;
                break;
            case 6:
                rotateFn(6, 300, tips[1]); //8元 
                call = 18;
                break;
            /* case 7:
                rotateFn(3, 120, tips[3]); //15W  
                call = 3;
                price_safe=true;
                break; */
        }
    }
    //选中函数。参数：奖品序号、角度、提示文字
    function rotateFn(awards, angle, text) {
        /*手机号的处理
        var arr = [13477735912, 13100656035, 15926909285];
        var a = arr[0] + "";
        var f = a.substr(0, 3);
        var l = a.substr(7, 4);*/
        bool = true;
        $prize.stopRotate();
        $prize.rotate({
            angle: 0, //旋转的角度数
            duration: 4000, //旋转时间
            animateTo: angle + 1440, //给定的角度,让它根据得出来的结果加上1440度旋转。也就是至少转4圈
            callback: function () {
                bool = false; // 标志为 执行完毕
                win();
                show(1, 1, text);
            }
        });
    }

    //中奖信息滚动。前两个参数为手机号前三位和后四位手机尾号，text为抽中的奖品
    function show(sNum, eNum, text) {
        $(".gift_key").html(text);
    }

    //中奖信息提示
    $("#close,.win,.btn").click(function () {
        $prize.addClass("running");
        init();
    });
});

//话费中奖
function gift_money(){

    $.ajax({
        url: "sAdventures",
        type: "POST",
        dataType: "json",
        data: {
            agentid: ParentId,
            userid: userid,
            call: 0,
            shop: call
        },
        success: function (data) { //请求成功完成后要执行的方法
        	if (data.errorCode != 2000) {
        		$(".gift_key").html(data.data);
        	}
            console.log(data);
        }
    });

}
//保险中奖
function gift_safe(){
    console.log("safe");
    $.ajax({
        url: "sInsurance",
        type: "POST",
        dataType: "json",
        data: {
            agentid: ParentId,
            userid: userid
        },
        success: function (data) { //请求成功完成后要执行的方法
        	if (data.errorCode == 2000) {
                price_safe=false;
        		$(".gift_key").html("获得保险额，请联系客服领取！");
        	}else{
                $(".gift_key").html(data.data);
            }
            console.log(data);
        }
    });
}
//中獎請求
function gift() {
    if(price_safe==true){
        gift_safe();
    }else{
        gift_money();
    }
}
</script>
</body>
</html>